<template>
  <div class="content">
    <div class="layout">
      <el-row :gutter="20">
        <el-col :span="12">
          <div class="editor">
            <wangEditor @change="change" /></div
        ></el-col>

        <el-col :span="12"
          ><div class="grid-content bg-purple">当前时间:{{ currentTime }}</div>
          <div>
            <Title ref="titleRef" />
          </div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
// import wangEditorVue from './wangEditor.vue';
import wangEditor from "./wangEditor.vue";
import Title from "./Title.vue";
export default {
  props: {},
  components: {
    wangEditor,
    Title,
  },
  data() {
    return {
      currentTime: "",
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {
    // this.currentTime = new Date().getTime();
    this.currentTime = this.$moment().format("YYYY-MM-DD HH:mm:ss");
    console.log(this.currentTime);
    console.log(this.$refs.titleRef.value1);
    // this.$refs.titleRef.value1 = ["2020-01-01", "2020-01-10"];
    this.$set(this.$refs.titleRef, "value1", ["2020-01-03", "2020-01-10"]);

    // this.$set(this.$refs.titleRef.value1, ["2020-01-01", "2020-01-02"]);
  },
  methods: {
    change(html) {
      console.log("change", html);
    },
  },
};
</script>

<style scoped lang="less">
.content {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  // align-items: center;
}
.editor {
  // width: 500px;
}
.bg-purple {
  background-color: #ffffff;
}
</style>
